<div ng-include="'/modules/template/header.html'"></div>  
<div class="zc_box">
	<div class="container">
    	<div class="row">
			<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_top">
				<div class="col-lg-2 col-md-2 col-sm-1 col-xs-0"></div>
				<div class="col-lg-8 col-md-8 col-sm-10 col-xs-12 zc_main">
					<div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 zc_nav" ng-class="{zc_active : step == '1'}">
						<a href="">
							<span class="nav-1">1</span>
							<span class="nav-2">设置基本信息</span>
						</a>
					</div>
					<div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 zc_nav" ng-class="{zc_active : step == '2'}">
						<a href="">
							<span class="nav-1">2</span>
							<span class="nav-2">填写联系方式</span>
						</a>
					</div>
					<div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 zc_nav" ng-class="{zc_active : step == '3'}">
						<a href="">
							<span class="nav-1">3</span>
							<span class="nav-2">填写实名信息</span>
						</a>
					</div>
					<div class="col-lg-3 col-md-3 col-sm-3 col-xs-6 zc_nav zc_nav4" ng-class="{zc_active : step == '4'}">
						<a href="">
							<span class="nav-1">√</span>
							<span class="nav-2">注册成功</span>
						</a>
					</div>
				</div>
			</div>
        </div>
    </div>
</div>

<div class="zc_main_box" ng-init="step = 1">
    <form class="cmxform form-horizontal tasi-form" name="myForm" novalidate="novalidate">
		<div class="container" ng-show="step == 1">
	    	<div class="row">
	    		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
					<span class="nav-1" style="padding-left: 1em">用户名</span><input type="text" ng-model="user.userName" name="userName" maxlength="20" ng-required="true" ng-pattern="/^[a-zA-Z0-9_]{6,20}$/">
					<div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
	                    <!--  <div ng-show="myForm.userName.$dirty && myForm.userName.$error.minlength"
	                              class="alert alert-danger help-block nav-1">
	                             不能少于6个字符
	                     </div> -->
	                     <div ng-show="myForm.userName.$dirty && myForm.userName.$error.required"
                                  class="alert alert-danger help-block nav-1">
                                 用户名不能为空
                         </div>
                         <div ng-show="myForm.userName.$dirty && myForm.userName.$error.pattern"
                              class="alert alert-danger help-block nav-1">
                                 6-20位，只支持字字母、数字、下划线
                         </div>
					</div>
				</div>
				<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2" style="padding-left: 2em">邮箱</span><input type="text" ng-model="user.email" ng-pattern="/^[0-9a-z_]+@(([0-9a-z]+)[.]){1,2}[a-z]{2,3}$/" name="email" ng-required="true">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                        <div ng-show="myForm.email.$dirty && myForm.email.$error.pattern"
                              class="alert alert-danger help-block nav-1">
                                 请输入有效的邮箱地址
                         </div>
                         <div ng-show="myForm.email.$dirty && myForm.email.$error.required"
                                  class="alert alert-danger help-block nav-1">
                                 邮箱不能为空
                         </div>
                    </div>
	            </div>
	    		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
					<span class="nav-2" style="padding-left: 2em">密码</span><input type="password" ng-model="user.password" name="password" maxlength="32" ng-pattern="/^[a-z0-9]*$/" ng-required="true" ng-minlength="6">
					<div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                         <div ng-show="myForm.password.$dirty && myForm.password.$error.minlength"
                                  class="alert alert-danger help-block nav-1">
                                 不能少于6个字符
                         </div>
                         <div ng-show="myForm.password.$dirty && myForm.password.$error.required"
                                  class="alert alert-danger help-block nav-1">
                                 密码不能为空
                         </div>
                         <div ng-show="myForm.password.$dirty && myForm.password.$error.pattern"
                                     class="alert alert-danger help-block">
                                 密码是数字或字母
                         </div>
                    </div>
				</div>
				<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">确认密码</span><input type="password" ng-model="user.confirmPassword" maxlength="32" name="confirmPassword" ng-required="true">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                        <div ng-show="myForm.confirmPassword.$dirty && (user.password!==user.confirmPassword)" class="alert alert-danger help-block">
                            两次密码不一致
                        </div>
                    </div>
	            </div>
	    		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1 " ng-class="{'zc_main_ac' : myForm.$valid && (user.password == user.confirmPassword)}">
					<button type="button" ng-click="nextStep(1)" ng-disabled="myForm.$invalid">下一步</button>
				</div>
	        </div>
	    </div>
	</form>
	<form name="myForm2">
	    <div class="container" ng-show="step == 2">
	        <div class="row">
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">真实姓名</span>
	                <input type="text" ng-model="user.realName" name="realName" maxlength="10">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">单位名称</span>
	                <input type="text" ng-model="user.comName" name="comName" maxlength="20">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">所在地区</span>
	                <div data-toggle="distpicker" id="distpicker" style="display: inline;">
					  <select name="province" style="width: 92px;" class="province" ng-init="province.id='0'" ng-model="province.id" ng-change="cBox.provinceChange(province.id);city.id='0';" ng-options="id as name for (id,name) in cBox.provinceArr"></select>
	                  <select name="city" style="width: 92px;" class="city" ng-init="city.id='0'" ng-model="city.id" ng-change="cBox.cityChange(city.id);" ng-options="id as name for (id,name) in cBox.getCityArr"></select>
					</div>
					<div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">联系地址</span>
	                <input type="text" ng-model="user.connectAddress" name="connectAddress" maxlength="30">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2" style="padding-left: 2em">邮编</span>
	                <input type="text" ng-model="user.postcode" name="postcode" ng-pattern="/^1[0-9]{5}$/" maxlength="6">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
	                    <div ng-show="myForm2.postcode.$dirty && myForm2.postcode.$error.pattern"
	                        class="alert alert-danger help-block">
	                       邮编为1开头的6位数字，请输入有效的邮编
	                   </div>
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">固定电话</span>
	                <input type="text" ng-model="user.phoneNum" name="phoneNum" ng-pattern="/^\d*$/" maxlength="12">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
	                    <div ng-show="myForm2.phoneNum.$dirty && myForm2.phoneNum.$error.pattern"
	                        class="alert alert-danger help-block">
	                       请输入有效的固定电话
	                   </div>
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-1">移动电话</span>
	                <input type="text" ng-model="user.telePhone" name="telePhone" maxlength="11" ng-pattern="/^1[34578]\d{9}$/" />
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
	                    <div ng-show="myForm2.telePhone.$dirty && myForm2.telePhone.$error.pattern"
	                        class="alert alert-danger help-block">
	                       请输入有效的移动电话号码
	                   </div>
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2" style="padding-left: 2em">传真</span>
	                <input type="text" ng-model="user.fax" ng-pattern="/^[0-9\-\s]$/" name="fax" maxlength="15">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
	                   <div ng-show="myForm2.fax.$dirty && myForm2.fax.$error.pattern"
                            class="alert alert-danger help-block">
                           请输入有效的传真号码
                       </div>
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1" ng-class="{'zc_main_ac' : myForm2.$valid }">
	                <button type="button" ng-click="nextStep(2)" ng-disabled="myForm2.$invalid" style="margin-left: 30px;">下一步</button> <!-- ng-disabled="myForm2.$invalid" -->
	                <a ng-click="step = 3" style="margin-left: 25px;">跳过，以后再填</a>
	            </div>
	        </div>
	    </div>
	</form>
	<form name="myForm3">
	    <div class="container" ng-show="step == 3">
	        <div class="row">
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2">证件类型</span>
	                <select ng-model="user.idTypeV" ng-options="idType.d_value as idType.d_value for idType in idTypeList">
					    <option value="">选择证件类型</option>
					</select>
					<div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2">证件号码</span>
	                <input type="text" ng-model="user.idNum" name="idNum" maxlength="18">
	                <!-- <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                        <div ng-show="myForm3.idNum.$dirty && myForm3.idNum.$error.pattern"
                            class="alert alert-danger help-block">
                           证件号码全部为数字
                       </div>
                   </div> -->
                   <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2" style="padding-left: 3em;">称谓</span>
	                <div class="radio-group" style="display: inline-block; width: 200px; margin-left: 1em;">
		                <input type="radio" style="width: 30px; margin: 0;" ng-model="user.sex" name="sex" ng-value="1">先生
		                <input type="radio" style="width: 30px;" ng-model="user.sex" name="sex" ng-value="0">女士
	                </div>
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2">出生日期</span><input type="text" class="time" readonly ng-model="user.birthDate" name="birthDate">
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
	                <span class="nav-2">教育程度</span>
	                <select ng-model="user.educationV" ng-options="education.d_value as education.d_value for education in educationList">
	                    <option value="">选择教育程度</option>
	                </select>
	                <div class="row" style="width: 258px;margin: 5px auto;margin-top: 15px;">
                   </div>
	            </div>
	            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1" ng-class="{'zc_main_ac' : myForm.$valid }">
	                <button type="button" ng-click="nextStep(3)" ng-disabled="myForm3.$invalid" style="margin-left: 30px;">完成</button>
	                <a ng-click="register()" style="margin-left: 25px;">跳过，以后再填</a>
	            </div>
	        </div>
	    </div>
	</form>
    <div class="container" ng-show="step == 4">      
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1">
           <div class="yx-hua0" ng-if="regMessage.success">
                <img src="/temp/images/sz-sc.png" />
                <span>{{regMessage.message}}</span>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1 zc_main_ac">
                    <a ng-click="goBackMain()">>>> 返回首页</a>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="yx-hua0" ng-if="!regMessage.success">
                <img src="/temp/images/sz-er.png" />
                <span style="color: red;">{{regMessage.message}}</span>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 zc_main_1 zc_main_ac">
                    <a ng-click="reload()">>>> 重新注册</a>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
</div>
